//有状态组件
import 'package:flutter/material.dart';

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  // ignore: library_private_types_in_public_api
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(
          'Row组件',
          style: TextStyle(color: Colors.white),
        ),
        backgroundColor: Colors.purple,
      ),
      //1.GridView默认
      // body: GridView(
      //   gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
      //       crossAxisCount: 3,
      //       childAspectRatio: 4 / 3,
      //       crossAxisSpacing: 10,
      //       mainAxisSpacing: 10),
      //   children: [
      //     Container(
      //       color: Colors.cyan,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.yellow,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.cyan,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.yellow,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.cyan,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.yellow,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.cyan,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.yellow,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     ),
      //     Container(
      //       color: Colors.cyan,
      //       alignment: Alignment.center,
      //       child: const Text('黑马测试'),
      //     )
      //   ],
      // ));
      //2.GridView.Builder
      //   body: GridView.builder(
      //       gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
      //           crossAxisCount: 3),
      //       itemBuilder: (context, index) {
      //         return Container(
      //             color: Colors.red,
      //             alignment: Alignment.center,
      //             child: Text('测试$index'));
      //       },
      //       itemCount: 30),
      // );
      //3.GridVeiw.extent
      body: GridView.extent(
        maxCrossAxisExtent: 100,
        childAspectRatio: 4 / 3,
        crossAxisSpacing: 10,
        mainAxisSpacing: 10,
        children: [
          Container(
            color: Colors.red,
            alignment: Alignment.center,
            child: const Text('初级会计会计法'),
          ),
          Container(
            color: Colors.orange,
            alignment: Alignment.center,
            child: const Text('初级会计会计法'),
          ),
          Container(
            color: Colors.red,
            alignment: Alignment.center,
            child: const Text('初级会计会计法'),
          ),
          Container(
            color: Colors.orange,
            alignment: Alignment.center,
            child: const Text('初级会计会计法'),
          ),
          Container(
            color: Colors.red,
            alignment: Alignment.center,
            child: const Text('初级会计会计法'),
          )
        ],
      ),
    );
  }
}
